<template>
	<view>
		<!-- <view class="flex justify-around  padding">
			<view class="flex-sub text-white text-center">答题记录</view>
			<view class="flex-sub text-white text-center">规则说明</view>
		</view> -->
		<!-- 头像区域 -->

		<view class="flex flex-direction justify-center align-center" style="height: 365px;width: 100%;">
			<view class="cu-avatar xl round "
				style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big25002.jpg);">
				<view class="cu-tag badge light	 bg-blue">获胜者</view>
			</view>
			<!-- 名字 -->
			<view class="text-xxl text-white margin-top text-bold">获胜者:小呆</view>
			<!-- 积分 -->
			<view class="text-xxl text-white margin-top text-bold">获分:12</view>
			<view class="text-xxl text-white margin-top text-bold">总分:120 <text class="text-green margin-left-sm">+12</text>
			</view>

		</view>

		<view class="flex justify-center align-center" style="width: 100%;margin-top: 40%;">
			<view class="flex justify-center align-center justify-around" style="height: 130px;width: 340px;gap: 10px;">
				<view class="flex flex-sub flex-direction justify-center align-center radius  "
					style="background: #FF9797;height: 100%;opacity: 0.8;">
					<view class="iconsize icon1"> </view>
					<view class="text-xl text-white text-bold">邀请好友</view>
				</view>
				<view @tap="$openrul('/pages/randomPk/randomPk')"
					class="flex flex-sub flex-direction justify-center align-center radius  "
					style="background: #FF9797;height: 100%;opacity: 0.8;">
					<view class="iconsize icon2"> </view>
					<view class="text-xl text-white text-bold"> 随机匹配</view>
				</view>
			</view>

		</view>


	</view>
</template>

<script>
export default {
	data() {
		return {

		}
	},
	methods: {

	}
}
</script>

<style>
page {
	background-image: url('');
	background-size: cover;
}

.iconsize {
	width: 53px;
	height: 53px;
}

.icon1 {
	background-image: url('');
	background-size: cover;
}

.icon2 {
	background-image: url('');
	background-size: cover;
}
</style>
